<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>快速入门升级</title>
</head>
<body>
<div id="div">
    <div>姓名{{name}}</div>
    <div>专业{{professional}}</div>
    <button onclick="hi()">打招呼</button>
    <button onclick="update()">修改专业</button>
</div>
</body>
<script src="../vue/vue.js"></script>
    <script type="text/javascript">
        //脚本
        let vm=new Vue({
            el:"#div",
            data:{
                name:"张三",
                professional:"计科"
            },
            methods:{
                study(){
                    alert(this.name+"是"+this.professional+"专业的")
                }
            }
        });
        //定义打招呼方法
        function hi(){
            vm.study();
        }
        //定义修改专业
        function update(){
            vm.professional="软工";
        }

    </script>
</html>